<!DOCTYPE html>

<html>

<head>
    <title>支付确认</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <meta charset="UTF-8">
    <link rel="stylesheet" href="../../resource/weui.min.css" />
    <link rel="stylesheet" href="../../resource/example.css" />
    <script src="../../script/api.js"></script>
    <script src="../../resource/jquery-1.js"></script>
    <script type="text/javascript" src="../../resource/wap_common.js"></script>
    <script type="text/javascript" src="../../resource/common.js"></script>
    <link type="text/css" rel="stylesheet" href="../../resource/fapiao.css">
    <link rel="stylesheet" href="../../resource/jinsuistyle.css" />
</head>

<body>
    <div id="jsheader" style="z-index: 99;">
        <nav id="jsnav">
            <a id="jsleft" tapmode="" onclick="api.closeWin();">
                <span>返回</span>
            </a>
            <div id="jsmiddle">
                <strong id="jstitle">转账</strong>
            </div>
            <a id="jsright">
                <span onclick="openMenu()">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
            </a>
        </nav>
    </div>

    <!-- <div class="page__category js_categoryInner" style="display:none;position:absolute;right:0;width:200px;z-index:999;top:27px">
        <div class="weui-cells page__category-content">
            <a class="weui-cell weui-cell_access js_item">菜单1</a>
            <a class="weui-cell weui-cell_access js_item">菜单2</a>
            <a class="weui-cell weui-cell_access js_item">菜单3</a>
            <a class="weui-cell weui-cell_access js_item">菜单4</a>
        </div>
    </div> -->

    <div class="paddingtop70"></div>
    <div class="page__bd">
        <div class="weui-cells">
            <!-- <div style="text-align:center;padding:30px;">
                <label>向晏俊凯转账</label>
            </div> -->
            <div class="weui-cell">
                <div class="weui-cell__hd">
                    <label class="weui-label">金额</label>
                </div>
                <div class="weui-cell__bd">
                    <input id="in_je" class="weui-input" type="text" placeholder="请输入转账金额"></input>
                </div>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd">
                    <label class="weui-label">附言</label>
                </div>
                <div class="weui-cell__bd">
                    <input class="weui-input" type="text" placeholder="选填（不超过10个字）"></input>
                </div>
            </div>
        </div>
        <br />
        <div class="page__bd page__bd_spacing">
            <a class="weui-btn weui-btn_default" style="background-color:#285dc4;color:#fff" onclick="openConfirm();">确认转账</a>
        </div>
    </div>
    <div id="div_mask" style="display:none;background-color:#000;opacity: 0.6;overflow:hidden;position:absolute;top:0;left:0;right:0;bottom:0;z-index:998">&nbsp;</div>
    <div id="div_confirm" style="display:none;position:absolute;bottom:0;right:0;left:0;min-height:400px;background-color:#fff;margin:10px;border-radius:8px;z-index:999">
        <div style="text-align:center;padding-top:10px;">
            <label>向晏俊凯转账</label>
            <a class="weui-btn weui-btn_default" style="right:10px;top:8px;position:absolute;color:#555;font-size:12px;" onclick="cancelOrder()">取消</a>
        </div>
        <div class="page__bd">
            <div class="weui-cells">

                <div class="weui-cell">
                    <div class="weui-cell__bd">
                        <p>订单信息</p>
                    </div>
                    <div class="weui-cell__bd">
                        <div class="weui-cell__ft" style="font-size:14px;color:#333;">转账-转账给晏俊凯</div>
                    </div>
                </div>
                <div class="weui-cell  weui-cell_access">
                    <div class="weui-cell__bd">
                        <p>付款方式</p>
                    </div>
                    <div class="weui-cell__bd">
                        <div class="weui-cell__ft" style="font-size:14px;color:#333;">招商银行借记卡(7485)</div>
                    </div>
                </div>
                <div class="weui-cell">
                    <div class="weui-cell__bd">
                        <p>需付款</p>
                    </div>
                    <div class="weui-cell__bd">
                        <div id="div_je" class="weui-cell__ft" style="color:#000;font-size:24px;padding:10px;"></div>
                    </div>
                </div>

            </div>
            <div class="page__bd page__bd_spacing" style="position:absolute;bottom:30px;left:0;right:0">
                <a class="weui-btn weui-btn_default" style="background-color:#285dc4;color:#fff" onclick="closeConfirm()">确认付款</a>
            </div>
        </div>
    </div>
</body>
<script>
    function openConfirm() {
        var jeStr = $("#in_je").val();
        if (jeStr == "") {
            api.alert({
                title: '金额输入错误',
                msg: '金额为空，请输入金额',
            });
        } else {
          var exp = /^([1-9][\d]{0,7}|0)(\.[\d]{1,2})?$/;
          if (exp.test(jeStr)) {
                var je = parseFloat(jeStr).toFixed(2);
                $("#div_je").html(je + "元");
                $("#div_mask").show();
                $("#div_confirm").show();
            } else {
                api.alert({
                    title: '金额输入错误',
                    msg: '金额输入不合法，请输入正确的金额',
                });
            }
        }
    }

    function closeConfirm() {
        $("#div_mask").hide();
        $("#div_confirm").hide();
    }

    function cancelOrder() {
        api.confirm({
            title: '取消支付',
            msg: '是否放弃支付？',
            buttons: ['放弃支付', '继续支付']
        }, function(ret, err) {
            if (ret.buttonIndex == 1) {
                $("#div_mask").hide();
                $("#div_confirm").hide();
            }
        });

    }
</script>

</html>
